function show(query, show) {
  document.querySelectorAll(query).forEach(function (e) {
    e.style.display = show ? '' : 'none';
  });
}

function IsPC() {
  let userAgentInfo = navigator.userAgent;
  let Agents = new Array('Android', 'iPhone', 'SymbianOS', 'Windows Phone', 'iPad', 'iPod');
  let flag = true;

  for (let v = 0; v < Agents.length; v++) {
    if (userAgentInfo.indexOf(Agents[v]) > 0) {
      flag = false;
      break;
    }
  }

  return flag;
} // 激活菜单


function active(i) {
  document.querySelectorAll('.navs a').forEach(function (e, j) {
    if (i == j) {
      // 大屏右侧菜单 与 小屏弹出菜单 保持同步
      e.style.color = 'white';
    } else {
      e.style.color = '#7f7f7f';
    }
  });
  document.querySelectorAll('.menus a').forEach(function (e, j) {
    if (i == j) {
      // 大屏右侧菜单 与 小屏弹出菜单 保持同步
      e.style.color = 'white';
    } else {
      e.style.color = '#7f7f7f';
    }
  });

  if (i == 0) {
    show('#home, #content', true);
    show('#join,#download,#about', false);
  }

  if (i == 1) {
    show('#home,#content,#join,#about', false);
    show('#download', true);
  }

  if (i == 2) {
    show('#home,#content,#download,#about', false);
    show('#join', true);
  }

  if (i == 3) {
    show('#home,#content,#download,#join', false);
    show('#about', true);
  }
}

function show_menu_phone(show) {
  document.getElementById('menu_phone').className = show ? '' : 'none';
}

(function () {
  active(0); // 菜单自动切换

  function GetRect(element) {
    var rect = element.getBoundingClientRect();
    var top = !!document.documentElement.clientTop ? document.documentElement.clientTop : 0;
    var left = !!document.documentElement.clientLeft ? document.documentElement.clientLeft : 0;
    return {
      top: rect.top - top,
      bottom: rect.bottom - top,
      left: rect.left - left,
      right: rect.right - left
    };
  }

  var $download = document.getElementById('download');
  var windowH = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight; //浏览器高度兼容写法

  window.onscroll = function () {// active(0)
    // var obj = GetRect($download);
    // if (obj.top >= windowH) {
    //   active(0)
    // }
    // if (obj.top < windowH && obj.bottom >= windowH) {
    //   active(1)
    // }
  };

  var time = null; // 字体动画
  // 字体动画

  var fonts = [200, 300, 400, 500, 600, 700, 900]; //var fonts=["ExtraLight", "Light", "SemiBold", "Regular", "Medium", "Blod", "Heavy"];

  function font_animate() {
    var cur = 0,
        cur2 = 2;
    var inc = true,
        inc2 = true;
    time = setInterval(function () {
      inc == true ? cur++ : cur--;

      if (cur == fonts.length) {
        inc = false;
        cur = fonts.length - 2;
      }

      if (cur == 0) {
        inc = true;
      }

      inc2 == true ? cur2++ : cur2--;

      if (cur2 == fonts.length) {
        inc2 = false;
        cur2 = fonts.length - 2;
      }

      if (cur2 == 0) {
        inc2 = true;
      }

      document.getElementById('tc').className = '_2 tc-' + fonts[cur];
      document.getElementById('sc').className = '_2 sc-' + fonts[cur2];
    }, 200);
  }

  document.getElementById('font-animate').addEventListener('mouseenter', font_animate);
  document.getElementById('font-animate').addEventListener('mouseleave', init_font);

  if (IsPC()) {
    // 页面初始化，先执行2秒动画，加载所有字体
    font_animate();
    setTimeout(function () {
      init_font();
    }, 2000);
  } else {
    font_animate(); // 如果是手机，动画一直执行，因为没有鼠标事件
  }

  function init_font() {
    clearInterval(time);
    document.getElementById('tc').className = '_2 tc-' + fonts[0];
    document.getElementById('sc').className = '_2 sc-' + fonts[0];
  }

  var ua = window.navigator.userAgent;
  var isSafari = ua.indexOf('Safari') != -1 && ua.indexOf('Version') != -1; // Safari 上没有 loading 动画，因为safari的理解是将所有资源，还包含视频加载完后，才触发 onload 事件

  if (!isSafari) {
    window.onload = function () {
      document.getElementById('loading').style.display = 'none';
    };
  } else {
    document.getElementById('loading').style.display = 'none';
  } // 动画点击后是【激活】状态


  var position_li = document.querySelectorAll('.position');
  var mouseenter, click;
  position_li.forEach(function (e, i) {
    e.addEventListener('mouseenter', function () {
      if (click) return;
      mouseenter = true;
      position_li.forEach(function (e, j) {
        e.className = i == j ? 'position hover' : 'position stop';
      });
    });
    e.addEventListener('mouseleave', function () {
      if (click) return;
      mouseenter = false;
      setTimeout(function () {
        position_li.forEach(function (e, j) {
          if (!mouseenter) {
            e.className = 'position';
          }
        });
      }, 1000);
    });
    e.addEventListener('click', function () {
      click = true;
      document.querySelectorAll('.job')[0].style.display = 'block';
      position_li.forEach(function (e, j) {
        e.className = i == j ? 'position active' : 'position stop';
      });
      document.querySelectorAll('.job div').forEach(function (e, k) {
        e.className = i == k ? '' : 'none';
      });
    });
  });
})();